<template>
  <view class="footer flex items-center justify-between">
    <view class="item">
      <img
        class="image"
        src="https://lsol-house-upload.oss-cn-hangzhou.aliyuncs.com/2020-09-29wxls/yuanApp/utils/yuanEnter.jpg"
        alt=""
      />
      <wx-open-launch-app
        id="launch-btn"
        appid="wx10bfdb73134e5a01"
        :extinfo="extinfo"
        class="wx-open-content"
      >
        <script type="text/wxtag-template">
          <style scoped>.btn { width: 100%;height: 100%;opacity: 0; }</style>
          <div class="btn">App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App内查看App</div>
        </script>
      </wx-open-launch-app>
    </view>
  </view>
</template>

<script>
  import { wxOpenLaunchApp } from 'jweixin-module';
  export default {
    name: 'WxOpenApp',

    props: {
      extinfo: {
        type: String,
        default: '',
        require: true,
      },
    },

    data() {
      return {};
    },

    methods: {},
  };
</script>

<style lang="scss" scoped>
  .footer {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.3);
    z-index: 999;

    .item {
      position: absolute;
      bottom: 0;
      left: 0;
      display: flex;
      justify-content: center;
      align-items: center;
      width: 100%;
      height: auto;
      color: #fff;
      // border-radius: 50%;
      // border: 1px solid #eee;
      font-size: 20px;
    }

    .image {
      width: 10rem;
      height: auto;
      box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
    }
  }

  .wx-open-content {
    position: absolute;
    z-index: 99999;
    width: 100%;
    height: 100%;
    opacity: 0;
  }
</style>
